@model CatalogSettingsModel

<div class="card-body">
    <div class="form-group row">
        <div class="col-md-3">
            <nop-override-store-checkbox asp-for="NumberOfProductTags_OverrideForStore" asp-input="NumberOfProductTags" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
            <nop-label asp-for="NumberOfProductTags" />
        </div>
        <div class="col-md-9">
            <nop-editor asp-for="NumberOfProductTags" />
            <span asp-validation-for="NumberOfProductTags"></span>
        </div>
    </div>
    <div class="form-group row">
        <div class="col-md-3">
            <nop-override-store-checkbox asp-for="ProductsByTagAllowCustomersToSelectPageSize_OverrideForStore" asp-input="ProductsByTagAllowCustomersToSelectPageSize" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
            <nop-label asp-for="ProductsByTagAllowCustomersToSelectPageSize" />
        </div>
        <div class="col-md-9">
            <nop-editor asp-for="ProductsByTagAllowCustomersToSelectPageSize" />
            <span asp-validation-for="ProductsByTagAllowCustomersToSelectPageSize"></span>
        </div>
    </div>
    <nop-nested-setting asp-for="ProductsByTagAllowCustomersToSelectPageSize">
        <div class="form-group row" id="pnlProductsByTagPageSize">
            <div class="col-md-3">
                <nop-override-store-checkbox asp-for="ProductsByTagPageSize_OverrideForStore" asp-input="ProductsByTagPageSize" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
                <nop-label asp-for="ProductsByTagPageSize" />
            </div>
            <div class="col-md-9">
                <nop-editor asp-for="ProductsByTagPageSize" />
                <span asp-validation-for="ProductsByTagPageSize"></span>
            </div>
        </div>
        <div class="form-group row" id="pnlProductsByTagPageSizeOptions">
            <div class="col-md-3">
                <nop-override-store-checkbox asp-for="ProductsByTagPageSizeOptions_OverrideForStore" asp-input="ProductsByTagPageSizeOptions" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
                <nop-label asp-for="ProductsByTagPageSizeOptions" />
            </div>
            <div class="col-md-9">
                <nop-editor asp-for="ProductsByTagPageSizeOptions" />
                <span asp-validation-for="ProductsByTagPageSizeOptions"></span>
            </div>
        </div>
    </nop-nested-setting>
    <div class="form-group row">
        <div class="col-md-3">
            <nop-override-store-checkbox asp-for="ProductsByTagPriceRangeFiltering_OverrideForStore" asp-input="ProductsByTagPriceRangeFiltering" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
            <nop-label asp-for="ProductsByTagPriceRangeFiltering" />
        </div>
        <div class="col-md-9">
            <nop-editor asp-for="ProductsByTagPriceRangeFiltering" />
            <span asp-validation-for="ProductsByTagPriceRangeFiltering"></span>
        </div>
    </div>
    <nop-nested-setting asp-for="ProductsByTagPriceRangeFiltering">
        <div class="form-group row advanced-setting" id="pnlProductsByTagManuallyPriceRange">
            <div class="col-md-3">
                <nop-override-store-checkbox asp-for="ProductsByTagManuallyPriceRange_OverrideForStore" asp-input="ProductsByTagManuallyPriceRange" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
                <nop-label asp-for="ProductsByTagManuallyPriceRange" />
            </div>
            <div class="col-md-9">
                <nop-editor asp-for="ProductsByTagManuallyPriceRange" />
                <span asp-validation-for="ProductsByTagManuallyPriceRange"></span>
            </div>
        </div>
        <div id="pnlProductsByTagPriceRange">
            <nop-nested-setting asp-for="ProductsByTagManuallyPriceRange">
                <div class="form-group row advanced-setting">
                    <div class="col-md-3">
                        <nop-override-store-checkbox asp-for="ProductsByTagPriceFrom_OverrideForStore" asp-input="ProductsByTagPriceFrom" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
                        <nop-label asp-for="ProductsByTagPriceFrom" />
                    </div>
                    <div class="col-md-9">
                        <nop-editor asp-for="ProductsByTagPriceFrom" asp-postfix="@Model.PrimaryStoreCurrencyCode" />
                        <span asp-validation-for="ProductsByTagPriceFrom"></span>
                    </div>
                </div>
                <div class="form-group row advanced-setting">
                    <div class="col-md-3">
                        <nop-override-store-checkbox asp-for="ProductsByTagPriceTo_OverrideForStore" asp-input="ProductsByTagPriceTo" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
                        <nop-label asp-for="ProductsByTagPriceTo" />
                    </div>
                    <div class="col-md-9">
                        <nop-editor asp-for="ProductsByTagPriceTo" asp-postfix="@Model.PrimaryStoreCurrencyCode" />
                        <span asp-validation-for="ProductsByTagPriceTo"></span>
                    </div>
                </div>
            </nop-nested-setting>
        </div>
    </nop-nested-setting>
</div>

<script>
    $(document).ready(function () {
        $("#@Html.IdFor(model => model.ShowCategoryProductNumber)").click(toggleShowCategoryProductNumberIncludingSubcategories);
        $("#@Html.IdFor(model => model.EmailAFriendEnabled)").click(toggleEmailAFriend);
        $("#@Html.IdFor(model => model.RecentlyViewedProductsEnabled)").click(toggleRecentlyViewedProducts);
        $("#@Html.IdFor(model => model.NewProductsEnabled)").click(toggleNewProducts);
        $("#@Html.IdFor(model => model.ShowBestsellersOnHomepage)").click(toggleBestsellersOnHomepage);
        $("#@Html.IdFor(model => model.ProductsAlsoPurchasedEnabled)").click(toggleProductsAlsoPurchasedNumber);
        $("#@Html.IdFor(model => model.ProductsByTagAllowCustomersToSelectPageSize)").click(toggleProductsByTagPageSize);
        $("#@Html.IdFor(model => model.ProductsByTagPriceRangeFiltering)").click(toggleProductsByTagPriceRangeFiltering);
        $("#@Html.IdFor(model => model.ProductsByTagManuallyPriceRange)").click(toggleProductsByTagPriceRangeFiltering);

        toggleShowCategoryProductNumberIncludingSubcategories();
        toggleEmailAFriend();
        toggleRecentlyViewedProducts();
        toggleNewProducts();
        toggleBestsellersOnHomepage();
        toggleProductsAlsoPurchasedNumber();
        toggleProductsByTagPageSize();
        toggleProductsByTagPriceRangeFiltering();
    });

    function toggleShowCategoryProductNumberIncludingSubcategories() {
        if ($('#@Html.IdFor(model => model.ShowCategoryProductNumber)').is(':checked')) {
            $('#pnlShowCategoryProductNumberIncludingSubcategories').showElement();
        } else {
            $('#pnlShowCategoryProductNumberIncludingSubcategories').hideElement();
        }
    }

    function toggleEmailAFriend() {
        if ($('#@Html.IdFor(model => model.EmailAFriendEnabled)').is(':checked')) {
            $('#pnlAllowAnonymousUsersToEmailAFriend').showElement();
        } else {
            $('#pnlAllowAnonymousUsersToEmailAFriend').hideElement();
        }
    }

    function toggleRecentlyViewedProducts() {
        if ($('#@Html.IdFor(model => model.RecentlyViewedProductsEnabled)').is(':checked')) {
            $('#pnlRecentlyViewedProductsNumber').showElement();
        } else {
            $('#pnlRecentlyViewedProductsNumber').hideElement();
        }
    }

    function toggleNewProducts() {
        if ($('#@Html.IdFor(model => model.NewProductsEnabled)').is(':checked')) {
            $('#pnlNewProductsNumber').showElement();
        } else {
            $('#pnlNewProductsNumber').hideElement();
        }
    }

    function toggleBestsellersOnHomepage() {
        if ($('#@Html.IdFor(model => model.ShowBestsellersOnHomepage)').is(':checked')) {
            $('#pnlNumberOfBestsellersOnHomepage').showElement();
        } else {
            $('#pnlNumberOfBestsellersOnHomepage').hideElement();
        }
    }

    function toggleProductsAlsoPurchasedNumber() {
        if ($('#@Html.IdFor(model => model.ProductsAlsoPurchasedEnabled)').is(':checked')) {
            $('#pnlProductsAlsoPurchasedNumber').showElement();
        } else {
            $('#pnlProductsAlsoPurchasedNumber').hideElement();
        }
    }

    function toggleProductsByTagPageSize() {
        if ($('#@Html.IdFor(model => model.ProductsByTagAllowCustomersToSelectPageSize)').is(':checked')) {
            $('#pnlProductsByTagPageSize').hideElement();
            $('#pnlProductsByTagPageSizeOptions').showElement();
        } else {
            $('#pnlProductsByTagPageSize').showElement();
            $('#pnlProductsByTagPageSizeOptions').hideElement();
        }
    }

    function toggleProductsByTagPriceRange() {
        if ($('#@Html.IdFor(model => model.ProductsByTagManuallyPriceRange)').is(':checked')) {
            $('#pnlProductsByTagPriceRangeFrom').hideElement();
            $('#pnlProductsByTagPriceRangeTo').hideElement();
            $('#@Html.IdFor(model => model.ProductsByTagManuallyPriceRange)').closest('.parent-setting-reversed').addClass('parent-setting-ticked');
        } else {
            $('#pnlProductsByTagPriceRangeFrom').showElement();
            $('#pnlProductsByTagPriceRangeTo').showElement();
            $('#@Html.IdFor(model => model.ProductsByTagManuallyPriceRange)').closest('.parent-setting-reversed').removeClass('parent-setting-ticked');
        }
    }

    function toggleProductsByTagPriceRangeFiltering() {
        if ($('#@Html.IdFor(model => model.ProductsByTagPriceRangeFiltering)').is(':checked')) {
            $('#pnlProductsByTagManuallyPriceRange').showElement();

            if ($('#@Html.IdFor(model => model.ProductsByTagManuallyPriceRange)').is(':checked')) {
                $('#pnlProductsByTagPriceRange').showElement();
            } else {
                $('#pnlProductsByTagPriceRange').hideElement();
            }
        } else {
            $('#pnlProductsByTagPriceRange').hideElement();
            $('#pnlProductsByTagManuallyPriceRange').hideElement();
        }
    }
</script>